promise.all()怎么使用

您所在的位置：网站首页 › js promise 最多请求并发 › promise.all()怎么使用

promise.all()怎么使用

2023-04-30 08:39| 来源: 网络整理| 查看: 265

这篇文章主要介绍“promise.all()怎么使用”，在日常操作中，相信很多人在promise.all()怎么使用问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”promise.all()怎么使用”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！

关于promise.all()的使用

Promise.all可以将多个Promise实例包装成一个新的Promise实例。

同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。

关键代码：将所有异步操作存储到数组pros中，Promise.all(pros)执行所有异步操作

let pros = [] data.forEach(element => { pros.push( this.getJsonFile(element.json,element.fileName) ) }); Promise.all(pros).then(val => { this.fontsList = [...val] })

示例：

// 获取字体所有json文件展示 getIconFonts(isFresh) { req.post(window.context.uc+`/system/file/v1/queryIconFiles`).then(rep => { if(rep && rep.data) { // 将所有异步操作存储到数组pros中 let pros = [] data.forEach(element => { pros.push( this.getJsonFile(element.json,element.fileName) ) }); // 执行所有异步操作后处理数据 Promise.all(pros).then(val => { this.fontsList = [...val] this.uploadFonts = [...this.fontsList] }) } }); }, // 通过id获取json文件 getJsonFile(fileId, fileName) { return new Promise((resolve, reject) => { req.get(window.context.uc +'/system/file/v1/preview?fileId=' + fileId).then(rep => { if(rep && rep.data) { let data = { fileName, ...rep.data } // 返回处理后的数据 resolve(data) } }) }) }

Promise.all实现限制并发请求函数

Promise.all 的简单解释

// 当以下数组中promise1, promise2, promise3都resolve之后，触发promise.all的then函数。 Promise.all([promise1, promise2, promise3]).then((values) => { console.log(values); });

需求解释

所谓并发请求，即有待请求接口100个，限制每次只能发出10个。即同一时刻最多有10个正在发送的请求。

每当10个之中有一个请求完成，则从待请求的接口中再取出一个发出。保证当前并发度仍旧为10。

直至最终请求完成。

设计思路

简单思路如下：（假设并发请求函数名字为limitedRequest）

设定一个数组（命名为：pool），用于后续Promise.all的使用

当limitedRequest被调用的时候，首先一次性发出10个请求，并放入到pool中

每一个请求完成后的回调函数中继续触发下一个请求，而下一个请求返回Promise，他的回调函数继续绑定同样的回调函数，即循环调用。（看不懂就直接看代码更易懂）

直到全部请求完成，停止。

代码实现

具体代码如下

// 模仿一个fetch的异步函数，返回promise function mockFetch(param) { return new Promise((resovle) => { setTimeout(() => { resovle(param); }, 2000); }); } function limitedRequest(urls, maxNum) { const pool = []; // 处理maxNum比urls.length 还要大的情况。 const initSize = Math.min(urls.length, maxNum); for (let i = 0; i { console.log('请求已经全部结束'); }); } // 函数调用 limitedRequest([1, 2, 3, 4, 5, 6, 7, 8], 3);

# 最终返回结果$ node .srcviewsdocdetailindex.js当前并发度： 3当前并发度： 3当前并发度： 3当前并发度： 3当前并发度： 3当前并发度： 3并发请求已经全部发起当前并发度： 3并发请求已经全部发起当前并发度： 3并发请求已经全部发起请求已经全部结束

转载请注明：promise.all()怎么使用 | 李雷博客 - PHP博客

【本文地址】

promise.all()怎么使用

promise.all()怎么使用

今日新闻

推荐新闻